第二天來囉，忘記JS30這個題目太廣泛，可能會認為是介紹js的意思，這邊指的是JS30這個挑戰！接下來就來做第二天的內容吧

Day2

demo頁面，這次主要是利用js搭配css去做出會動的時鐘畫面

html部分做出一個時鐘區塊，以及裡面的三個指針

<div class="clock">
    <div class="clock-face">
      <div class="hand hour-hand"></div>
      <div class="hand min-hand"></div>
      <div class="hand second-hand"></div>
    </div>
</div>

js部分我們要抓取到現在的時間，以及分別算出秒針、分針、時針每一秒去移動的度數為多少，再取出度數之後，利用css rotate的屬性，去更改指針的位置，這邊利用setInterval去執行運算函示，每一秒鐘都去更新

//指針選取元素
    const secondHand = document.querySelector('.second-hand')
    const minHand = document.querySelector('.min-hand')
    const hourHand = document.querySelector('.hour-hand')
    //取得現在時間
    const now = new Date();
    //分針、秒針每動一格是6度，時針30度，div區塊一開始是水平呈現要讓他指到12點位置，所以加上90
    let seconds = now.getSeconds() * 6 + 90;
    let minutes = now.getMinutes() * 6 + 90;
    let hours = now.getHours() * 30 + 90;
    //讓各個指針指到相對位子
    secondHand.style.transform = `rotate(${seconds}deg )`;
    minHand.style.transform = `rotate(${minutes}deg )`;
    hourHand.style.transform = `rotate(${hours}deg)`;

    function setDate() {
      //每秒鐘6度
      seconds += 360 / 60;
      //分針轉一圈60分鐘，3600秒
      minutes += 360 / 3600;
      //時針轉一圈43200秒
      hours += 360 / 43200;
      secondHand.style.transform = `rotate(${seconds}deg )`;
      minHand.style.transform = `rotate(${minutes}deg )`;
      hourHand.style.transform = `rotate(${hours}deg)`;
    }
    setInterval(setDate, 1000)

以上就是第二天的內容！